<script lang="ts" setup>


import {ref} from "vue";

const props = defineProps({params: {type: String, required: true}});

const colspan = ref(1)
const rowspan = ref(1)
const width = ref("");

for (const attr of props.params.split(' ')) {
  const w = /width(\d+)/.exec(attr)?.[1]
  if (w) width.value = `width:${width}%`

  const c = /colspan(\d+)/.exec(attr)?.[1]
  if (c) colspan.value = Number(c)

  const r = /rowspan(\d+)/.exec(attr)?.[1]
  if (r) rowspan.value = Number(r)
}

</script>

<template>
  <td :colspan="colspan" :rowspan="rowspan" :style="width?`width:${width}%`:undefined" class="nga-td">
    <slot></slot>
  </td>
</template>

<style scoped>

</style>